<template>
	<view>
		<view v-for="(item, index) in popupList" :key="item.src">
			<su-popup
				v-if="index === currentIndex"
				:show="item.isShow"
				type="center"
				backgroundColor="none"
				round="0"
				:showClose="true"
				:isMaskClick="false"
				@close="onClose(index)"
			>
				<view class="img-box">
					<image
						class="modal-img"
						:src="$url.cdn(item.src)"
						mode="widthFix"
						@tap.stop="onPopup(item.url)"
					/>
				</view>
			</su-popup>
		</view>
	</view>
</template>

<script setup>
	import { computed, ref } from 'vue';
	import { onShow } from '@dcloudio/uni-app';
	import { saveAdvHistory } from '/shop/hooks/useModal';
	import $app from '/shop/store/app.js';
	import $url from '/shop/url/index.js';
	import $router from '/shop/router/index.js';
	const modalStore = JSON.parse(uni.getStorageSync('modal-store') || '{}');
	const advHistory = modalStore.advHistory || [];
	const currentIndex = ref(0);
	const popupList = computed(() => {
		const list = $app().template.basic?.popupad?.setStyle?.list || [];
		// 设置广告图片可以是多个.....
		const newList = [];
		if (list.length > 0) {
			list.forEach((adv) => {
				if (adv.show === 2 && advHistory.includes(adv.img)) {
					adv.isShow = false;
				} else {
					adv.isShow = true;
					newList.push(adv);
				}
				saveAdvHistory(adv);
			});
		}
		return newList;
	});

	function onPopup(path) {
		$router.go(path);
	}

	function onClose(index) {
		currentIndex.value = index + 1;
		popupList.value[index].isShow = false;
	}
</script>

<style lang="scss" scoped>
	.img-box {
		width: 610rpx;
		// height: 800rpx;
	}
	.modal-img {
		width: 100%;
		height: 100%;
	}
</style>
